<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>动画效果</title>
	<style>
		.box1{
			width:256px;
			height:256px;
			margin:0 auto;
			background-image:url('bg2.png');
			animation:test 1s steps(6) infinite ;
		}
		@keyframes test{
			from{
				background-position:0 0;
			}

			to{
				background-position:-1536px 0;
			}
		}
	</style>
</head>
<body>
	<div class="box1"></div>
</body>
</html>